<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" href="../css/reg.css">
    <script src="../lb/jquery-1.11.3.js"></script>
    <script src="../lb/axios.js"></script>
    <script src="../this_locality.js/comfy.js"></script>
    <script src="../this_locality.js/cook.js"></script>

</head>

<body>

    <!-- 头部 -->
    <header>
        <div id="top">
            <a href="index.html" class="logo"><img src="../img/logo.png" alt="网易考拉" title="网易考拉"></a>
            <a href="index.html" class="kaola-top"><img src="../img/kaola-top.png" alt="网易考拉" title="网易考拉"></a>
        </div>
    </header>
    <!-- 第二部分 -->
    <article>
        <div class="center">
            <a href="index.html"><img src="../img/reg-left.PNG" id="reg-left" alt="图片无法加载" title="网易考拉"></a>
            <div id="zhuce-right">
                <div class="zhuce-top">
                    <a href="#" class="btn-zhuce">注册</a>|
                    <a href="#" class="btn-denglu"> 登录</a>
                </div>

                <!-- 注册 -->
                <form action="#" method="post" class="zhuce-ipt" style="display: none">
                    <input type="text" class="zhuce name" placeholder="用户名" >
                    <input type="text" class="zhuce elail" placeholder="邮箱" required="">
                    <input type="password" class="zhuce password" placeholder="密码" required="">
                    <input type="text" class="zhuce number" placeholder="手机号码" required="">
                    <input type="button" class="zhuce-btn" value="免费注册">
                </form>





                <!-- 登录 -->
                <form action="" class="delu">
                    <input type="text" class="ipt" placeholder="请输入您的账号" value="2245788656">
                    <input type="password" class="ipt ipts" placeholder="请输入您的密码" value="2245788656">
                    <input type="checkbox" class="check"><span class="check-span" style="color:springgreen">10天免登陆</span>
                    <input type="button" class="login-denglu" value="登录">
                    <a href="#" class="wangjimima">记住密码?</a>

                    
                </form>

            </div>
        </div>

    </article>
    <footer>
        <div id="aboutNEST">
            <div id="footer-top">
                <a href="#">About NetEase</a>
                -
                <a href="#">公司简介</a>
                -
                <a href="#">联系方法</a>
                -
                <a href="#">友情链接</a>
                -
                <a href="#">招聘信息</a>
                -
                <a href="#">客户服务</a>
                -
                <a href="#">隐私政策</a>
                -
                <a href="#">网络营销</a>
                -
                <a href="#">网易考拉 </a>
            </div>
            <div id="footer-center">
                <span>网络文化经营许可证：浙网文[2019]1372-138号&nbsp;&nbsp;&nbsp; </span>
                <span> 增值电信业务经营许可证：浙B2-20160288&nbsp;&nbsp;&nbsp;</span>
                <a href="#">自营经营者信息&nbsp;&nbsp;</a>
                <span>（浙）网械平台备字[2018]第00007号 </span>
            </div>
            <div id="footer-bottom">
                <a href="#"><img src="../img/footer/footer-1.png" alt=""></a>
                <a href="#">浙公网安备 33010802002216号&nbsp;&nbsp;</a>
                <a href="#">&nbsp;网易公司版权所有©1997-2019&nbsp;&nbsp;</a>
                <a href="#">互联网药品信息服务资格证书编号（浙）-2017-0027&nbsp;&nbsp;</a>
                <a href="#">浙ICP备16011229号-6</a>
            </div>
            <div id="footer-img">
                <a href="#"><img src="../img/footer/footer-2.png" alt=""></a>
                <a href="#"><img src="../img/footer/footer-3.png" alt=""></a>
                <a href="#"><img class="xuke" src="../img/footer/footer-4.gif" alt=""></a>
            </div>
        </div>
    </footer>
    <script>
        ; (function ($) {
            var user_Boolean = false;
            var password_Boolean = false;
            var emaile_Boolean = false;
            var Mobile_Boolean = false;
            //注册表单验证
            //用户名
            $(".name").blur(function () {
                if ((/^[a-z0-9_-]{4,11}$/).test($(".name").val())) {
                    $('.name').html("?").css("color", "green");
                    user_Boolean = true;
                } else {
                    $('.name').html("×").css("color", "red");
                    user_Boolean = false;
                }
            })
            //邮箱
            $('.elail').blur(function () {
                if ((/^[a-z\d]+(\.[a-z\d]+)*@([\da-z](-[\da-z])?)+(\.{1,2}[a-z]+)+$/).test($(".elail").val())) {
                    $('.elail').html("?").css("color", "green");
                    emaile_Boolean = true;
                } else {
                    $('.elail').html("×").css("color", "red");
                    emaile_Boolean = false;
                }
            });

            //密码
            $('.password').blur(function () {
                if ((/^[a-z0-9_-]{6,16}$/).test($(".password").val())) {
                    $('.password').html("?").css("color", "green");
                    password_Boolean = true;
                } else {
                    $('.password').html("×").css("color", "red");
                    password_Boolean = false;
                }
            });
            //手机号
            $('.number').blur(function () {
                if ((/^1[34578]\d{9}$/).test($(".number").val())) {
                    $('.number').html("?").css("color", "green");
                    Mobile_Boolean = true;
                } else {
                    $('.number').html("×").css("color", "red");
                    Mobile_Boolean = false;
                }
            });
            //切换按钮
            $(".btn-zhuce").click(function () {
                $(".delu").hide()
                $(".zhuce-ipt").show()


            })

            $(".btn-denglu").click(function () {
                $(".delu").show()
                $(".zhuce-ipt").hide()
            })


            //注册
            let name = document.querySelector(".name")
            let _password = document.querySelector(".password")
            console.log($(".zhuce-btn"))
            $(".zhuce-btn").click(function () {
                //console.log(11)
                //console.log($(".name"))
                axios.get(regApi, {
                    params: {
                        username: name.value,
                        password: _password.value,
                    }
                }).then(res => {
                   // console.log(name.value,_password.value)
                    if (user_Boolean && password_Boolean && emaile_Boolean && Mobile_Boolean == true) {
                        alert("注册成功");
                    } else {
                        alert("请完善信息");
                    }
                }).catch(error => {
                   // console.log(error)
                })
            })

            //登录
            $(".login-denglu").click(function () {
                let name = document.querySelector(".ipt")
            let _password = document.querySelector(".ipts")

                let _cheacShitian = document.querySelector(".check")
                if ($(".ipt").val() == "" && $(".ipts").val() == "") {
                    alert("用户名和密码不能为空")
                }
                else {
                    axios.get(loginApi, {
                        params: {
                            username: name.value,//用户名
                            password: _password.value,//密码
                        }
                    }).then(res => {
                        console.log(name.value,_password.value)
                        if (res.data.code == 1) {
                            alert(res.data.msg);
                            var day = 1;
                            if (_cheacShitian.checked) {
                                day = 10;
                            }
                            setCookie("id", res.data.data.id, day)
                            setCookie("username", res.data.data.username, day)
                             location.href = "index.html"

                        } else {
                            alert(res.data.msg)

                        }

                    }).catch(error => {
                        console.log(error)
                    })
                }

            })




        })(jQuery)



    </script>
</body>

</html>